<template>
  <el-container direction="vertical">
    <SearchForm :columns="formColumn" @search="search" @reset="search" />
		<el-header>
			<div class="left-panel">
				<el-button icon="el-icon-download" class="mr10">
					导出
				</el-button>
			</div>
		</el-header>
		<el-main class="nopadding">
			<scTable
				ref="table"
				v-bind="list"
				row-key="id"
				stripe
				:vritualData=" vritualData"
				:setUpType="false"
				:hidePropOrder="true"
			>
				<!-- <el-table-column
					label="操作"
					width="120"
					fixed="right"
					align="center"
				>
					<template #default="scope">
						<el-button
							size="small"
              :type="checkTime(scope.row.classTime, scope.row.status) ? 'info' : 'primary'"
              :disabled="checkTime(scope.row.classTime, scope.row.status)"
							@click="viewsDetail(scope.row)"
							>{{ scope.row.status == '已考勤' ? '【查看】' : '【考勤】'}}</el-button>
					</template>
				</el-table-column> -->
        <template #className="scope">
					<el-link
						type="primary"
            @click="viewAttendance(scope.row)"
						>{{ scope.row.className }}</el-link>
				</template>
			</scTable>
      <MyDialog ref="dialogRef"/>
      <HistoricalAttendance ref="HistoricalAttendanceRef"/>
		</el-main>
  </el-container>
</template>
<script>
import SearchForm from "@/components/SearchForm/index.vue";
import { formColumn, column} from "./date";
import scFileImport from '@/components/scFileImport';
import MyDialog from './components/MyDialog.vue';
import HistoricalAttendance from './components/HistoricalAttendance.vue';
export default {
	components: { SearchForm, scFileImport, MyDialog, HistoricalAttendance},
  data() {
    return {
    	formColumn,
    	list: {
				apiObj: this.$API.student.attendanceTeacher,
				params: {},
				column,
			},
			vritualData:[
				{
					className:'横岗',
					school:'东城',
					familyPhone:'120',
					a:'化妆',
					b:'1000',
          status: "已考勤",
          classTime: "09:00-17:00"
				},
				{
					className:'市桥',
					school:'商学院',
					familyPhone:'150',
					a:'美容',
					b:'1500',
          status: "未考勤",
          classTime: "09:00-20:00"
				},
				{
					className:'大沥',
					school:'东城',
					familyPhone:'100',
					a:'测试',
					b:'2000',
          status: "未考勤",
          classTime: "09:00-10:00"
				}
			],
			importExcel: {
			templateUrl: 'https://binaries.templates.cdn.office.net/support/templates/zh-cn/tf45048037_win32.xltm',
				apiObj: {
					post: () => Promise.resolve([])
				}
			}
		}
  },
  methods: {
    checkTime(time, status) {
      const nowTime = new Date()
      const hour = nowTime.getHours()*60
      const minutes = nowTime.getMinutes()*1
      const hour_b = time.substr(6, 2)*60
      const minutes_b = time.substr(9, 2)*1
      const result = hour+minutes
      const result_b = hour_b+minutes_b
      if (result > result_b && status == '未考勤') {
        return true
      }else{
        return false
      }
    },
		search(searchParams) {
			let params = {}
			if(searchParams) {
				const searchObj = JSON.parse(JSON.stringify(searchParams))
				params = Object.assign({}, searchObj, this.list.params)
			}else{
				params = Object.assign({}, this.list.params, {});
			}
			this.$refs.table.reload(params);
		},
    viewsDetail(row) {
      this.$refs.dialogRef.dialogVisible = true
    },
    viewAttendance(row) {
      this.$refs.HistoricalAttendanceRef.openDialog(row)
    },
		importStundentsExcel() {
      this.$refs.scFileImport.open();
    },
  },
}
</script>
<style lang="scss" scoped>
.mr10 {
  margin-right: 10px;
}
</style>